<template>
	<view class="mainpadding2">
		<u-navbar title="免運券管理" placeholder autoBack>
			<view class="flexright xiaohui" slot="right" @click="tianjia">添加</view>
		</u-navbar>
		<view class="">
			<u-tabs :list="tabslist" :scrollable="false"  lineColor="#ffb800" @click="changetab"
				:activeStyle="{
		    color: '#ffb800',
		    fontWeight: 'bold',
		    transform: 'scale(1.05)'
		}" :inactiveStyle="{
		            color: '#333333',
					fontWeight: '540',
		            transform: 'scale(1)'
		        }" itemStyle="padding-left: 10px; padding-right: 10px; height: 44px;"></u-tabs>
		</view>
		<view class="flexcenter" v-if="!shiplist.length">
			<view class="placeholderimage" style="margin-top: 100rpx;" ></view>
		</view>
		<view class="mainpadding_top ffffff radius" style="background-color: #fbf6f1;" v-for="item in shiplist" :key="item.id">
			<view class="flexbetween pdl">
				<view>
					<view class="titletext hei_text xiankuan bold">{{item.name}}</view>
					<view class="flexleft">
						<view class="huang_text margin_right margin_top main_size bold">滿${{item.di_money}}可用</view>
						<view class="xiaohui main_size bold margin_top">有效期至{{http.returnDate(item.endtime*1000)}}</view>
					</view>
					
				</view>
				<image src="@/static/image/system/ewm.png" mode="" style="width:100rpx;height: 100rpx;"  v-if="item.type==2" @click="proviewscan(item.id)"></image>
			</view>
			<view class="flexbetween margin_top">
				<view class="flexleft hei_text main_size bold">共：{{item.num}}張 餘：{{item.end_num}}張</view>
				<view class="flexright hei_text main_size bold" v-if="tabsid!=3">
					<view class="flexleft" @click="zhiding(item.id)">
						<u-icon name="fingerprint" color="#999" size="16"></u-icon>
						<view>指定</view>
					</view>
					<view class="flexleft margin_left" @click="bj(item.id)">
						<u-icon name="edit-pen" color="#999" size="16"></u-icon>
						<view class="xiaohei">編輯</view>
					</view>
					<view class="flexleft margin_left" @click="delitem(item)">
						<u-icon name="trash" color="#999" size="16"></u-icon>
						<view class="xiaohei">刪除</view>
					</view>
				</view>
			</view>
		</view>
			<u-modal :show="scanshow" title="掃碼領券" cancelText="關閉" confirmText="重繪二維碼" showCancelButton
				@confirm="proviewscant" @cancel="scanshow=false" confirmColor="#ffb800">
			<view class="slot-content" style="width: 600rpx;">
				<view class="flexcenter" v-if="scanshow">
					<uqrcode ref="uqrcode" canvas-id="qrcode"  v-bind:value="qrcodeurl_text"
						:options="{ margin: 10}" size="150">
					</uqrcode>
				</view>
			</view>
		</u-modal>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				tabsid: 1,
				tabslist: [{
						name: '客戶自動領取',
						value: 1,
					},{
						name: '客戶排隊領取',
						value: 2,
					},{
						name: '已過期',
						value: 3,
					}
				],
				shiplist: [],
				qrcodeurl:"",
				qrcodeurl_text:"",
				scanshow:false
			}
		},
		onShow() {
			this.init()
		},
		methods: {
			changetab(e) {
				console.log(e,"999");
				this.tabsid = e.value
				this.init()
			},
			proviewscan(id){
				this.scanid = id
				this.qrcodeurl_text = this.qrcodeurl+"?id="+id+"&time="+Number(new Date())
				console.log(this.qrcodeurl_text,"二維碼連結");
				this.scanshow = true
			},
			proviewscant(){
				this.qrcodeurl_text = this.qrcodeurl+"?id="+this.scanid+"&time="+Number(new Date())
				console.log(this.qrcodeurl_text,"二維碼連結");
				this.scanshow = true
			},
			zhiding(id){
				uni.navigateTo({
					url: '/pages/workbench/kehugl?type=2&id='+id
				})
			},
			delitem(item) {
				this.http.modal('提示', '確認刪除當前數據嗎？', true, (res) => {
					if (res) {
						this.http.request("/api/shop/shipdel", 'POST', {
							id: item.id
						}).then(res => {
							if (res.code == 1) {
								this.http.toast("刪除成功")
								this.init()
							} else {
								this.http.toast(res.msg);
							}
						})

					}
				})
			},
			bj(id) {
				uni.navigateTo({
					url: '/pages/workbench/tianjiamyq?id=' + id
				})
			},
			async init() {
				let res = await this.http.request("/api/shop/shiplist", 'POST', {
					shop_id: uni.getStorageSync("shop_id"),
					type:this.tabsid==3?"":this.tabsid,
					status:this.tabsid==3?3:1
				})
				if (res.code == 1) {
					this.shiplist = res.data.data
					this.qrcodeurl = res.data.myj_link
				} else if (res.code == 0) {
					this.http.toast(res.msg);
				} else {
					this.http.toast('暫無數據');
				}
			},
			tianjia() {
				uni.navigateTo({
					url: '/pages/workbench/tianjiamyq'
				})
			}
		}
	}
</script>

<style>

</style>